<template>
	<view>
		<uni-nav-bar dark title="赛季" fixed :statusBar="true">
			<block slot="left">
				<image @click="onRight" class="header-left" src="@/static/images/tab.png" mode=""></image>
			</block>
			<block slot="right">
				<view class="city">
					<view @click="onCreated">
						<uni-icons color="#fff" fontFamily="CustomFont" type="plusempty" :size="20"></uni-icons>
					</view>
				</view>
			</block>
		</uni-nav-bar>
		
		<view>
			<uni-segmented-control  :values="items" style-type="text" active-color="#E96E40"
				@clickItem="onClickItem" />
			<uni-search-bar clearButton="none"  cancelButton="none" @confirm="search"></uni-search-bar>
		</view>
		<view>
			<view class="list" v-for="(item, index) in list" :key="index" @click="onInfo(item.id)">
				<view>
					{{item.seasonName}}
				</view>
				<view class="time text-grey1">
					<text>开始时间：{{item.seasonBeginTime}}</text>
					<text>结束时间：{{item.seasonEndTime}}</text>
				</view>
			</view>
		</view>
		<uni-load-more :status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import {getseasonlist} from '@/api/season/indx.js'
	export default {
		data() {
			return {
				items: ['未结束', '已结束'],
				list: [],
				type: 1,
				seasonName: '',
				pageData: {
					pageSize: 20,
					pageNum: 1
				},
				total: 0,
				loadingType: 'more'
			}
		},
		methods: {
			onCreated() {
				uni.navigateTo({
					url: '/pages/season/season'
				})
			},
			onRight() {
				uni.navigateTo({
					url: '/pages/competition/switch'
				})
			},
			onInfo(id) {
				uni.navigateTo({
					url: '/pages/competition/home?id=' + id
				})
			},
			search(val) {
				console.log(val)
				this.seasonName = val.value;
				 this.getList();
			},
			onClickItem(val) {
				console.log(val)
				 this.type = val.currentIndex ? 2 : 1;
				 this.list = []
				 this.pageData = {
					 pageSize: 20,
					 pageNum: 1
				 }
				 this.getList();
			},
				
			getList() {
				let contestId = uni.getStorageSync('contestId');
				getseasonlist({contestId,type: this.type, seasonName: this.seasonName, ...this.pageData}).then(res => {
					this.total = res.total
					// this.list = res.rows;
					this.list.push(...res.rows)
					if (this.list.length == this.total) {
						this.loadingType = 'no-more'
						return;
					}
				})
			}
		},
		async onReachBottom() {
			if (this.list.length == this.total) {
				this.loadingType = 'no-more'
				return;
			}
			this.loadingType = 'loading'
			this.pageData.pageNum += 1
			this.getList()
		},
		onShow() {
			this.list = []
			this.getList();
		}
	}
</script>

<style lang="scss" scoped>
	.header-left {
		width: 20px;
		height: 20px;
	}
	.list {
		padding: 30rpx;
		border-bottom: 1px solid #ddd;
		view {
			&:nth-child(1) {
				font-size: 28rpx;
				font-weight: 600;
			}
		}
		.time {
			margin-top: 20rpx;
			font-size: 24rpx;
			text {
				margin-right: 20rpx;
			}
		}
	}
</style>